/**
* 描述：人事来信
*/
<style lang="scss" scoped>
  @import '../index';
  .table-main{

  }
</style>
<template>
  <div style="width:100%; height:100%;">
    <div class="com-main-title">
      <span class="tit">人事来信</span>
      <a class="nav" :class="{navCur: status == -1}" style="margin-left:30px;" @click="changeStatus(-1)">全部</a>
      <a class="nav" :class="{navCur: status == 2}" @click="changeStatus(2)">已接受</a>
      <a class="nav" :class="{navCur: status == 5}" @click="changeStatus(5)">已拒绝</a>
      <a class="nav" :class="{navCur: status == 3}" @click="changeStatus(3)">已入职</a>
      <div class="clear"></div>
    </div>
    <div class="noData" v-show="list && list.length == 0">暂无数据 :-)</div>
    <div class="table-list"  v-for="item in list">
      <div class="left" style="width:300px;">
        <p class="money">{{item.salaryLow}}-{{item.salaryHigh}}</p>
        <!--<i class="job">()</i>-->
        <div class="clear"></div>
        <div class="companyName">{{item.companyName}}</div>
        <div class="clear"></div>
        <div class="info">
          <i>{{item.cityId | cityAndType}}</i><i>|</i><i>{{item.education | education}}</i><i>|</i><i>{{item.experience | experience}}</i>
        </div>
      </div>
      <div class="center" style="width:350px;float: left;">
        <h5 style="line-height:30px;font-size:18px;color:#333;margin-top:20px;cursor: pointer" class="overflowHidden" @click="goToJobDetail(item.jobId)">{{item.title}}</h5>
        <h5 style="line-height:30px;font-size:12px;margin-top:10px;color:#999;">最后更新时间：{{item.createdAt}}</h5>
        <!--<h5 style="line-height:30px;font-size:14px;color:#333;">面试地点：</h5>-->
      </div>
      <div class="right">
        <div class="status fr">面试邀约：<i style="color: #0379ff;margin-right:10px;">{{ item.status | invitationState }}</i></div> <!--发出邀请，已接受，已拒绝，已过期-->
        <div class="clear"></div>
        <div class="btns" @click="dealInvitaion(item.id, true)" v-show="item.status < 2" style="float: right;margin-left:10px;width:90px;">接受</div>
        <div class="btns" @click="dealInvitaion(item.id, false)" v-show="item.status < 2" style="float: right;margin-left:10px;width:90px;background: #0379ff;color: #fff;">拒绝</div>
        <!--<div class="btns" @click="dealInvitaion(item.id)" style="float: right;margin-left:10px;width:90px;border-color:#ccc;color:#ccc;display:none;">删除</div>-->
        <div class="clear"></div>
      </div>
      <div class="clear"></div>
    </div>
    <div style="float: right;margin-top: 10px;">
      <template>
        <Page :total="totalElement" show-elevator :current="searchData.pageNo" :page-size="searchData.pageSize" @on-change="_getList"></Page>
      </template>
    </div>
    <div class="clear"></div>

    <!--修改用户名-->
    <Modal v-model="dealOk.show" :mask-closable="false" :closable="false" width="420" class="noTopBottomBorder">
      <p slot="header" style="color:#000;text-align:center;font-weight: bold;font-size: 18px;">
        <span v-show="dealOk.accept">确认面试邀请</span>
        <span v-show="!dealOk.accept">确认拒绝邀请</span>
      </p>
      <div style="transform: translateX(0%) translateZ(0px);margin-right:20px;">
        <b v-show="dealOk.accept" class="iconUCenter iconUCenter_bigAccept" style="margin:0 auto 20px;"></b>
        <b v-show="!dealOk.accept" class="iconUCenter iconUCenter_bigRefuse" style="margin:0 auto 20px;"></b>
      </div>
      <div slot="footer" style="width:220px;margin:-20px auto 20px;">
        <i-button size="large" @click="dealOk.show = false" style="width:100px;">取消</i-button>
        <i-button type="primary" size="large" v-show="dealOk.accept" @click="receiveInvitation(dealOk.id, true)" style="width:100px;">确认接受</i-button>
        <i-button type="primary" size="large" v-show="!dealOk.accept" @click="receiveInvitation(dealOk.id, false)" style="width:100px;">确认拒绝</i-button>
      </div>
    </Modal>
  </div>
</template>
<script>
  import list from '@/js/mixins/list';
  import hyHandler from '@/components/handler/handler';
  import { queryList, queryCount, acceptFun } from '@/service/web/user/personnelLetterService';
  export default {
    mixins: [list],
    components: {
      hyHandler
    },
    data () {
      return {
        status: -1,
        validate: {},
        searchData: {
        },
        dealOk: {
          show: false,
          id: null,
          accept: true // 1ok 2no
        },
        loading: false,
        statusList: [{value: 1, label: '收到的邀约'}, {value: 2, label: '已接受邀约'}, {value: 3, label: '已入职'}]
      };
    },
    mounted () {},
    methods: {
      async changeStatus (type) {
          if (type > 0) {
            this.status = type;
            this.searchData.status = type;
          } else {
            if (this.searchData.status) delete this.searchData.status;
            this.status = type;
          }
        await this._getList(this.searchData.pageNo);
      },
      async _getList (val) {
        if (val) this.searchData.pageNo = val;
        this.loading = true;
//        if (!this.searchData.status) this.searchData.status = 1;
        let result = await queryList(this.searchData);
        let temp = await queryCount(this.searchData);
        if (!result.data.length) result.data = null;
        this.list = result.data || [];
        this.totalElement = temp.data || 0;
        this.loading = false;
      },
      // 接收邀约 1 ok   2 拒绝
      dealInvitaion (id, status) {
          this.dealOk.show = true;
//          this.dealOk.type = status; //  1 ok   2 拒绝
          this.dealOk.id = id;
          this.dealOk.accept = status;
      },
      async receiveInvitation (id) {
          await acceptFun({id: id}, {accept: this.dealOk.accept});
        this.dealOk.show = false;
          this.$Notice.success({title: '操作成功'});
          await this._getList(this.searchData.pageNo);
      },
      // 跳转到职务详情
      goToJobDetail (id) {
        this.$router.push({path: '/jobDetail', query: {id: id}});
      }
    }
  };
</script>
